  <title>专业量表测试</title><%= javascript_include_tag :defaults %>
  <style>
  *{margin:0; padding:0;}
  img{border:0;}
  body{font-size:12px; font-family:"宋体", Arial; background:url(/images/user/test//bodybg_1.gif) repeat-x;}
  #mainbody{width:820px; margin:0 auto; margin-top:20px;height:1200px; background:url(/images/user/test/bg3_.gif) no-repeat;background-color:#98be53; border-top:2px #FFFFFF solid;border-left:2px #FFFFFF solid;border-right:2px #FFFFFF solid;}
  #main_left{width:200px; height:1200px; float:left;}
  #explanation{width:180px; height:800px;margin:0 auto;background-color:#ffffcc; line-height:1.8;}
  #exp_title{width:180px; height:38px;background-color:#f2f293; border-192bottom:2px solid #FFFFFF;}
  #explanation p{padding-left:20px; padding-top:20px; padding-right:5px;}
  #main_right{width:400px; height:1200px; float:left;}
  #head{width:820px; height:88px; float:left}
  #logo{width:220px; height:78px;float:left; margin-top:10px; margin-left:5px;}
  #head_text{width:200px; float:left; height:20px; line-height:20px; margin-top:48px; color:#fff;}

  #content-top{width:610px}
  #speed{width:460px; height:40px; background-color:#FFF9EF; float:left; margin-left:10px}
  #clock{float:left;width:100px;margin: -35px 0 0 30px;}
  #test-title{float:left;}

  .part-div{width:610px;float:left;}
  /*圆角*/
  #jiao1{height:1px;border-top:0;border-bottom:0;border-left:solid 3px #5aa6c2;border-right:solid 3px #5aa6c2;overflow:hidden;}
  #jiao2{height:1px;border-top:0;border-bottom:0;border-left:solid 2px #5aa6c2;border-right:solid 2px #5aa6c2;overflow:hidden;}
  #jiao3{height:1px;border-top:0;border-bottom:0;border-left:solid 1px #5aa6c2;border-right:solid 1px #5aa6c2;overflow:hidden;}
  /*圆角end*/
  #centent{width:610px; margin:0 auto; height:1000px; background-color:#fff;}

  /*测试选项CSS*/
  .page{width:610px; border:0px solid #9dd120; margin:0 auto; margin-top:10px;}
  .cs_table_1211{margin-bottom:10px; border-bottom:2px solid #9dd120;}
  .cs_title_1211{background-color:#eaffb5; height:24px; border-left:4px solid #FFFFFF;border-right:4px solid #FFFFFF; padding-left:10px;}
  .cs_daan_1211{height:40px; line-height:40px; padding-right:20px; text-align:left;}
  /*测试选项CSS -end*/

  #foot{width:820px; height:64px; margin:0 auto; background:url(/images/user/test/bg4111.gif) no-repeat;}
  </style>
<div id="mainbody">
    <div id="head">
      <div id="logo"><img src="/images/user/test/logo_1.gif" width="220" height="78"></img></div>
      <div id="head_text">专业量表 beta</div>
   </div>
   <div id="main_left">
      <div id="explanation">
        <div id="exp_title"></div>
           <p> 欢迎测试！</p>
        </div>
      </div>
  <div id="main_right">
    <div id="centent">
      <div id="jiao1"></div>
      <div id="jiao2"></div>
      <div id="jiao3"></div>
      <div id="cent_top"></div>
      <div id="cent_test">
        <div class="page">
          <!---------------form--------------->
          <% form_for(:test, :url => { :action => "many_trend_result" },
            :html => {:name=>'testQuestionForm', :id=>'testQuestionForm', :onsubmit=>'return m_checkform(this);' }) do |f|%>
            <input name="uid" value="883654" type="hidden"/>
            <div id="content-top">
              <div id="test-title">
                <h4 style="color:#FF7A0F;margin-left:150px"><%= @test.title %><%= @test.name %></h4><br/>
              </div>
              <div id="speed">
                <p style="margin: 10px 0 10px 10px">
                  测评中...　您已完成 <span>5%</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                  测试开始时间：9：30&nbsp;&nbsp;
                  已用时：20分钟
                </p>
              </div>
              <div id="clock" style="">
                <object width="100px" height="100px"
                      type="application/x-shockwave-flash"
                      data="/swfs/clock1.swf">
                <param value="true" name="allowfullscreen"/>
                <param value="always" name="allowscriptaccess"/>
                <param value="high" name="quality"/>
                <param value="false" name="cachebusting"/>
              </object>

              </div>
            </div>


        <div class="part-div">

          <!-----------------测试题开始---------------->
          <div>
          <input type="hidden" name="test_id" value=<%=@test.id%> />
                    <% if current_user.tested?(Survey.find(@test.id)) %>
                  <input type="hidden" name="re_test" value="yes"/>
                     <% end %>
          </div>

          <% i = 0 %>
          <% @test.parts.each do |part| %>
            <% i += 1 %>
            <% if i==1%>
            <div id="part<%=i%>" style="margin-top:10px 0 10px 10px">
            <% else %>
            <div id="part<%=i%>" style="display: none; margin-top:10px 0 10px 10px">
            <% end %>
            <b>&nbsp;&nbsp;第&nbsp;<%=i%>&nbsp;部分 :<%=part.name%></b><br/><br/>
             <% j=1 %>
            <% part.questions.each do |question|%>
            <input id="question<%=question.id%>" name="part<%=part.id%>[question<%=question.id%>][value]" 
            class="<%=i.to_s%>question-values" value="-255"type="hidden"/>
            <table width="100%" border="0" cellpadding="13" cellspacing="0">
              <tbody>
                <tr>
                  <td class="cs_title_1211" align="left">
                    <a name="position_6287">
                      <%= j %> .
                      <%= question.description %>: 
                      <% j=j+1%>
                    </a>
                    <input type="hidden" name="part<%=part.id%>[question<%=question.id%>][trend_scales_id]" 
                    value=<%=question.trend_scale_id.to_s%>></input>
                  </td>
                </tr>
                <tr>
                  <td align="center">
                    <table width="96%" border="0" cellpadding="13" cellspacing="0">
                      <tbody>
                      <% question.choices.each do |c| %>
                        <tr style="cursor: pointer;" onmousemove="this.bgColor='#F4F4F4'" onmouseout="this.bgColor=''" bgcolor="">
                            <td class="cs_daan_1211" onclick="nextItem(<%=part.id%>,<%=question.id%>,<%=c.id%>,3,24);" width="20">
                             <input id="answervalue_<%=c.id%>" name="part<%=part.id%>[question<%=question.id%>][answer]" value="<%=c.value%>" type="hidden"/>
                              <img src="/images/user/test/choose3.gif" id="<%=c.id %>"/>
                            </td>
                            <td class="cs_daan_1211" onclick="nextItem(<%=part.id%>,<%=question.id%>,<%=c.id %>,3,24);">
                              <%= c.content %>
                            </td>
                        </tr>
                      <% end %>
                      </tbody>
                    </table>
                  </td>
                </tr>
              </tbody>
            </table>
            <% end %><!--question   xunhuan-->
            <% if i ==1&& @test.parts.size > 1 %>
            <div><input value="下一步" type="button" onclick="next_part(<%=i+1%>);"></div>
            <% elsif  @test.parts.size == i -%>
            <div><input type="button" value="上一步" onclick="back(<%=i-1%>);">&nbsp;&nbsp;&nbsp;
            <input type="submit" value="完成" onclick=""/></div>
           <% else -%>
           <div><input type="button" value="上一步" onclick="back(<%=i-1%>);">&nbsp;&nbsp;&nbsp;
          <input value="下一步" type="button" onclick="next_part(<%=i+1%>);"></div>
          <% end %>   <!-- if end -->
          </div>
          <% end %><!--part  xunhuan-->
          
          <!-----------------测试题结束---------------->
         </div>
             
          <!--div>
            <input src="/lanxin/a_data/ckjgsb.jpg" type="image" style="margin-left:200px"/>
          </div>
        </div-->
        <% end %>
      </div>
</div>
<script type="text/javascript">
 function m_checkform(thisform) {
   part_size = <%= @test.parts.size %> ;
   for (var i=1 ; i<= part_size ; i++)
    {
     checkform(i);
    }
    return true;
  }
  
  //检查每一part 题目是否完成
  function checkform(thisform , id){
  var classname=(id-1)+"question-values";
    var values = thisform.getElementsByClassName(classname);
          for(var i=0; i<values.length; i++)
          {
              if(values[i].value == "-255") 
              {
              alert("您还没有完成,请做完全部题目！");
                return false;
              }
          }
          return true;
  }


function next_part(id){
   var f=document.getElementById("testQuestionForm");
    if (checkform(f,id)==true)
      {
       show_next_part(id);
      }
  }

//显示下一个子part的题目
function show_next_part(id){
  part_size = <%= @test.parts.size %> ;
  //隐藏所有part
  for(i=1; i<=part_size; i++) {
    document.getElementById("part" + i).hide();
  }

  document.getElementById("part" + id).show();
}

//显示上一个子part的题目
function back(id){
  part_size = <%= @test.parts.size %> ;
  //隐藏所有part
  for(i=1; i<=part_size; i++) {
    document.getElementById("part" + i).hide();
  }

  document.getElementById("part" + id).show();
}


function nextItem(part_id,question_id,imgId,itemPosition,itemCount){
	if(imgId==0)return false;
	var answerObj = document.getElementById(imgId);
	var answer = document.getElementById("question"+question_id);
	var value = document.getElementById("answervalue_"+answerObj.id).value;
	//给选择的答案赋值
	answer.value = value;

	//取消原来选中的                             "part"+part_id+"[question"+question_id+"][answer]"
	var answerObjs = document.forms["testQuestionForm"].elements["part"+part_id+"[question"+question_id+"][answer]"];
	for(var i=0;i<answerObjs.length;i++){
		var id = answerObjs[i].id;
		id= id.substring(id.indexOf("_")+1);
		document.getElementById(id).src="/images/user/test/choose3.gif";
	}

	//换图片
	answerObj.src="/images/user/test/choose4.gif";
	tmpAnswer = answerObj;

}
</script>
									</div>
					</div>
		</div>






